body{background:url("../img/miladfakurianbackgroundsombre.jpg") no-repeat center center/cover}.container{width:100%;height:100%;scroll-behavior:smooth;transition:.5s;position:absolute;top:0;right:0;z-index:2}.container.active{right:300px}section{z-index:1;padding:20px 40px;background:url("../img/miladfakurianbackgroundsombre.jpg") no-repeat center center/cover;position:relative;background-attachment:fixed;width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}section h3{margin-top:20px}section .exercices{width:80%;padding:20px 10px;display:flex;gap:40px;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center}section .exercices .exercice{cursor:pointer;display:flex;flex-direction:column;border-radius:5px;background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:200px;padding:40px;align-items:center;gap:10px;box-shadow:2px 2px 10px 3px rgba(0,0,0,.3)}section .exercices .exercice img{width:40px;height:40px;filter:invert(1)}section .exercices .exercice a{all:unset;font-weight:600;position:relative}section .exercices .exercice a:hover:before{width:100%}section .exercices .exercice a:before{content:" ";width:0;height:3px;position:absolute;bottom:-3px;left:0;background:#fff;transition:.3s ease}@keyframes backgroundglow{0%{background:#33135c}50%{background:#33135c;box-shadow:0px 15px 18px 3px #33135c}100%{background:#33135c}}